<template>
	<view class="AllCommunities">
		<view class="search f-background" v-if="!options">
			<u-search :showAction="false" searchIconSize="42rpx" height="76rpx" placeholder="请输入小区信息"
				v-model="params.dataBean.communityName" @search="mescroll.resetUpScroll()"
				@clickIcon="mescroll.resetUpScroll()" @clear="mescroll.resetUpScroll()"></u-search>
		</view>
		<mescroll-body @init="mescrollInit" @down="$event=>$event.resetUpScroll(false)"
			@up="$event=> postCommunityPageList($event.num)" :toTop="{width: '100px',height: '100px'}"
			:down="{auto: false}" :up="{auto: true, textNoMore: '-我也是有底线滴-',empty:{use:false}}">
			<view class="communities f-background radius20 margin-top-24"
				v-for="(item,index) in list" :key="index">
				<ServingCell :item="item" @previewImage="onPreviewImage($event)" />
			</view>
			<view class="default" v-if="!list.length && !loading">
				<Default tisName="暂无小区数据!" />
			</view>
		</mescroll-body>
	</view>
</template>

<script>
	import Default from "@/components/default/default"
	import ServingCell from "@/components/serving-cell/serving-cell"
	import { CommunityPageList,DeliveryUserInfo } from '@/api/index'
	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
	export default {
		components: { ServingCell, Default },
		mixins: [MescrollMixin], // 使用mixin
		data() {
			return {
				loading: true,
				list: [],
				params: {
					size: 20,
					current: 1,
					dataBean: {
						communityName: ''
					}
				},
				options: 0
			}
		},
		onShow() {
			this.canReset && this.mescroll.resetUpScroll() // 重置列表数据为第一页
			this.canReset && this.mescroll.scrollTo(0, 0) // 滚动条也重置到顶部
			this.canReset = true // 过滤第一次的onShow事件
		},
		onLoad(options){
			this.options = options.type*1
			uni.setNavigationBarTitle({
				title: options.type*1 ? '小区信息' : '所有小区'
			})
		},
		methods: {
			async postCommunityPageList() {
				this.params.current = this.mescroll.num
				if(this.options) {
					const { code, data } = await DeliveryUserInfo()
					if (code == '200') {
						this.list = data.community
						setTimeout(() => {
							this.loading = false
							this.mescroll.endByPage(data.community.length, data.community.length); //必传参数(当前页的数据个数, 总页数)
						}, 1000)
					}
					return
				}
				const { code, data } = await CommunityPageList(this.params)
				if (code == '200') {
					this.list = this.mescroll.num == 1 ? data.records : this.list.concat(data
						.records); //追加新数据
					setTimeout(() => {
						this.loading = false
						this.mescroll.endByPage(data.records.length, data.total); //必传参数(当前页的数据个数, 总页数)
					}, 1000)
				}
			},
			// 查看大图
			onPreviewImage(item) {
				uni.previewImage({
					current: 0,
					urls: [item]
				});
			},
		}
	}
</script>

<style lang="scss">
	.AllCommunities {
		.communities {
			padding: 20rpx;
			// margin-left: 24rpx;
			// margin-right: 24rpx;
			box-sizing: border-box;
		}
		.default{
			height: 90vh;
		}
		.search {
			width: 100vw;
			position: sticky;
			top: 0;
			box-sizing: border-box;
			// margin-bottom: 20rpx;
			padding: 20rpx;
			z-index: 10;
		}
	}
</style>